<template>
	<div class="wrap">
		<div class="box" v-for="(item, index) in data" :key="index" @click="onClick(item)">
			<img :src = "item.coverImg" alt = "">
			<div class="title" >{{item.title}}</div>
			<div class="footer">
				<div class="price">¥ {{item.memberPrice}}</div>
				<div class="num">销量: {{item.sales}}</div>
			</div>
		</div>
  	</div>
</template>

<script>
export default {
	name: "order_item",
	props: {
		data: [],
		isVip: false,
		title: ''
	},
	data() {
		return {
			userId: this.$cookie.get('userId')
		}
	},
	mounted() {
	},
	methods:{
	  onClick(e){
		  if(this.title == '拼团购') {
			  this.$router.push({
				  path: '/pintuangouDet?id='+e.id+'&title=拼团购'
			  })
		  } else {
			  this.$router.push({
				  path: '/productDetails?id='+e.id
			  })
		  }
	  }

	}

}
</script>

<style scoped>
	.wrap {
		display: flex;
		flex-wrap: wrap;
		width: 1200px;
	}
	.box {
		width: 25% !important;
		/* height: 320px; */
		padding: 20px;
		background: #fff;
		border: 1px solid #F6F5F7;
		box-sizing: border-box;
		margin-bottom: 20px;
	}
	img {
		width: 200px;
		height: 200px;
	}
	.title {
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}
	.footer {
		display: flex;
		justify-content: space-between;
		margin-top: 8px;
	}
	.price {
		font-weight: 700;
		color: #ff2d55;
		font-size: 22px;
	}
	.num {
		font-size: 12px;
		color: #666666;
		font-weight: 400;
	}
</style>
